<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>申请活动填写信息页面</title>
    <link rel="stylesheet" href="https://www.layuicdn.com/layui/css/layui.css">
</head>
<body>
<form class="layui-form"  style="width: 60%">
    <div class="layui-form-item">
        <label class="layui-form-label">活动种类</label>
        <div class="layui-input-inline">
            <input type="text" name="activityCategory" autocomplete="off" class="layui-input">
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">活动内容</label>
        <div class="layui-input-inline">
            <textarea name="activityContent" class="layui-textarea"></textarea>
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">活动人数</label>
        <div class="layui-input-inline">
            <input type="text" name="activityAmount" autocomplete="off" class="layui-input">
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">申请原因</label>
        <div class="layui-input-inline">
            <input type="text" name="applyReason" autocomplete="off" class="layui-input">
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">活动时间</label>
        <div class="layui-inline" id="test6">
            <div class="layui-input-inline">
                <input type="text" autocomplete="off" id="startTime" name="startTime" class="layui-input" placeholder="开始日期">
            </div>
            <div class="layui-form-mid">-</div>
            <div class="layui-input-inline">
                <input type="text" autocomplete="off" id="closeTime" name="closeTime" class="layui-input" placeholder="结束日期">
            </div>
        </div>
    </div>
    <div class="layui-form-item layui-form-text">
        <label class="layui-form-label">备注</label>
        <div class="layui-input-block">
            <textarea name="activityNote" class="layui-textarea"></textarea>
        </div>
    </div>
    <div class="layui-form-item">
        <div class="layui-input-block">
            <a class="layui-btn" id="save">立即提交</a>
            <button type="reset" class="layui-btn layui-btn-primary">重置</button>
            <a  class="layui-btn" id="cancel">取消</a>
        </div>
    </div>
</form>
<script src="https://www.layuicdn.com/layui/layui.js"></script>
<script>
    layui.use(['laydate', 'layer', 'jquery'], function () {
        let laydate = layui.laydate;
        let layer = layui.layer;
        let $ = layui.jquery;

        laydate.render({
            elem: '#test6', //开始时间和结束时间所在 input 框的父选择器
            //设置开始日期、日期日期的 input 选择器
            range: ['#startTime', '#closeTime'], //数组格式为 layui 2.6.6 开始新增
        });

        $("#save").click(() => {
            let serialize = $("form").serialize();
            $.post('/activity/saveActivityApply', serialize, response => {
                if (response.code==='200'){
                    parent.layer.msg('申请成功');
                }else {
                    parent.layer.msg('申请失败,请稍后再试');
                }
                cancel()
            })
        });

        // 关闭当前弹出层
        $("#cancel").click(()=>{
            cancel()
        })

        function cancel() {
            var index = parent.layer.getFrameIndex(window.name); //先得到当前iframe层的索引
            parent.layer.close(index); //再执行关闭
        }

    })
</script>
</body>
</html>